  <!DOCTYPE html>
<html lang="en" class="no-js">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="msapplication-tap-highlight" content="no" />

  <title>ADVANTAGE | Profile</title>


  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
  <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
  <link rel="stylesheet" href="bower_components/mdi/css/materialdesignicons.min.css">
  <link rel="stylesheet" href="bower_components/metisMenu/dist/metisMenu.min.css">
  <link rel="stylesheet" href="bower_components/Waves/dist/waves.min.css"> 
  <link rel="stylesheet" href="bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.css"> 

  <link rel="stylesheet" href="js/selects/cs-select.css">
  <link rel="stylesheet" href="js/selects/cs-skin-elastic.css">


    <script src="js/menu/modernizr.custom.js"></script>
 
  <link rel="stylesheet" href="css/style.css">
 
  <link rel="icon" href="img/favicon.ico" type="image/x-icon" />
  <link rel="shortcut icon" href="img/favicon.ico" type="image/x-icon" />
  <!--[if lt IE 9]>
      <script src="bower_components/html5shiv/dist/html5shiv.min.js"></script>
      <script src="bower_components/respondJs/dest/respond.min.js"></script>
    <![endif]-->
</head>

<body>
  <div id="main-wrapper" class="main-wrapper">
    <!--Preloader-->
    <div id="preloader" class="preloader table-wrapper">
      <div class="table-row">
        <div class="table-cell">
          <div class="la-ball-scale-multiple la-3x">
            <div></div>
            <div></div>
            <div></div>
          </div>
        </div>
      </div>
    </div>

    <ul id="gn-menu" class="gn-menu-main">
      <li class="gn-trigger">
        <a id="menu-toggle" class="menu-toggle gn-icon gn-icon-menu">
          <div class="hamburger">
            <span></span>
            <span></span>
            <span></span>
          </div>
          <div class="cross">
            <span></span>
            <span></span>
          </div>
        </a>
        <nav class="gn-menu-wrapper">
          <div class="gn-scroller">
            <ul class="gn-menu metismenu">
              <li class="gn-search-item">
                <input placeholder="Search" type="search" class="gn-search">
                <a class="search-icon"><i class="fa fa-search"></i><span>Search</span></a>
              </li>
              <li>
                <a href="index.html" aria-expanded="false"><i class="fa fa-th"></i>Dashboards<span class="fa arrow"></span></a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="index.html">Dashboard v1</a></li>
                  <li><a href="dashboard_2.html">Dashboard v2</a></li>
                  <li><a href="dashboard_3.html">Dashboard v3</a></li>
                </ul>
              </li>


              <li>
                <a href="calendar.html"><i class="fa fa-calendar-o"></i>Calendar<span class="label label-warning pull-right">9</span></a>
              </li>

              <li>
                <a href="mailbox.html" aria-expanded="false">
                  <i class="fa fa-envelope-o"></i>Email
                  <span class="fa arrow"></span>
                </a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="mailbox.html">Mailbox</a></li>
                  <li><a href="email-inbox.html">Inbox</a></li>
                  <li><a href="email-compose.html">Email Compose</a></li>
                  <li><a href="email-view.html">Email View</a></li>
                </ul>
              </li>
              <li>
                <a href="widgets.html">
                  <i class="fa fa-th-list"></i>Widgets
                  <span class="label label-danger pull-right">16</span>
                </a>
              </li>
              <li>
                <a href="typography.html">
                  <i class="fa fa-font"></i>Typography
                </a>
              </li>
              <li>
                <a href="grids.html">
                  <i class="fa fa-desktop"></i>Grid System
                </a>
              </li>
              <li>
                <a href="#" aria-expanded="false"><i class="fa fa-table"></i>Tables<span class="fa arrow"></span></a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="tables.html">Tables</a></li>
                  <li><a href="datatables.html">Data Tables</a></li>
                </ul>
              </li>
              <li>
                <a href="#" aria-expanded="false"><i class="fa fa-briefcase"></i>UI Kits<span class="fa arrow"></span></a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="colors.html">Colors</a></li>
                  <li><a href="animations.html">Animations</a></li>
                  <li><a href="icons.html">Icons</a></li>
                  <li><a href="form-elements.html">Forms</a></li>
                  <li><a href="sliders.html">Sliders</a></li>
                  <li><a href="buttons.html">Buttons</a></li>
                  <li><a href="breadcrumbs.html">Breadcrumbs</a></li>
                  <li><a href="nav-buttons.html">Nav buttons</a></li>
                  <li><a href="notifications.html">Notifications</a></li>
                  <li><a href="panels.html">Panels</a></li>
                  <li><a href="tabs.html">Tabs</a></li>
                  <li><a href="media.html">Media</a></li>
                  <li><a href="components.html">Other components</a></li>
                </ul>
              </li>
              <li>
                <a href="#" aria-expanded="false"><i class="fa fa-edit"></i>Charts<span class="fa arrow"></span></a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="flotjs.html">Flot.js</a></li>
                  <li><a href="chartjs.html">Chart.js</a></li>
                  <li><a href="morrisjs.html">Morris.js</a></li>
                </ul>
              </li>
              <li class="active">
                <a href="#" aria-expanded="false"><i class="fa fa-file"></i>Other pages<span class="fa arrow"></span></a>
                <ul class="gn-submenu collapse" aria-expanded="false">
                  <li><a href="todo_list.html">Todo list</a></li>
                  <li><a href="timeline.html">Timeline</a></li>
                  <li><a href="contacts.html">Contacts</a></li>
                  <li><a class="active" href="profile.html">Profile</a></li>
                  <li><a href="chat.html">Chat</a></li>
                  <li><a href="projects.html">Projects</a></li>
                  <li><a href="wizard.html">Wizard</a></li>
                  <li><a href="login.html">Login</a></li>
                  <li><a href="registration.html">Registration</a></li>
                  <li><a href="404.html">404</a></li>
                </ul>
              </li>
            </ul>
          </div>
          <!-- /gn-scroller -->
          <div class="bottom-bnts">
            <a class="profile" href="profile.html"><i class="mdi mdi-account"></i></a>
            <a class="fix-nav" href="#"><i class="mdi mdi-pin"></i></a>
            <a class="logout" href="#"><i class="mdi mdi-power"></i></a>
          </div>
        </nav>
      </li>
      <li>
        <a href="index.html" class="logo">ADVANTAGE<i class="fa fa-toggle-on"></i></a>
      </li>
      <li class="top-clock">
        <span class="current-time"></span>
      </li>
      <li class="pull-right">
        <ul class="nav navbar-right right-menu">
          <li class="members-btn">
            <a class="show-members">
              <i class="fa fa-group"></i>
            </a>
          </li>
          <li class="lang">
            <select class="cs-select cs-skin-elastic">
              <option value="english" data-class="flag-england cs-selected" selected>English</option>
              <option value="german" data-class="flag-germany">German</option>
              <option value="french" data-class="flag-france">French</option>
            </select>
          </li>
          <li class="dropdown notifications">
            <a class="dropdown-toggle" data-toggle="dropdown">
              <i class="fa fa-bell-o"></i> <span class="label label-warning">4</span>
            </a>
            <ul class="dropdown-menu">
              <li>
                <h4 class="zero-m text-center">Notifications</h4>
              </li>
              <li>
                <div class="messages">
                  <div class="member-info">
                    <img src="img/team/admin.png" alt="admin" class="img-circle pull-left">
                    <span class="member-name">Sash Ficus</span>
                    <p class="members-message zero-m">Research is done!</p>
                  </div>
                  <div class="member-info">
                    <img src="img/team/member.png" alt="admin" class="img-circle pull-left">
                    <span class="member-name">Vivien Hulk</span>
                    <p class="members-message zero-m">Working hard</p>
                  </div>
                  <div class="member-info">
                    <img src="img/team/admin.png" alt="admin" class="img-circle pull-left">
                    <span class="member-name">Sash Ficus</span>
                    <p class="members-message zero-m">Research is done!</p>
                  </div>
                  <div class="member-info">
                    <img src="img/team/member.png" alt="admin" class="img-circle pull-left">
                    <span class="member-name">Vivien Hulk</span>
                    <p class="members-message zero-m">Working hard</p>
                  </div>
                </div>
              </li>
            </ul>
          </li>
          <li class="dropdown some-btn">
            <a class="fullscreen">
              <i class="mdi mdi-fullscreen"></i>
            </a>
          </li>
        </ul>
      </li>
    </ul>

    <!--Content-->
    <div id="content" class="content">
      <div class="row">
        <div class="col-lg-12">
          <div class="page-header">
            <h2>Profile</h2>
            <ol class="breadcrumb">
              <li><a href="index.html">Home</a></li>
              <li>Other pages</li>
              <li class="active">Profile</li>
            </ol>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-3">
          <div class="content-box profile-sidebar box-shadow">
            <img src="img/user-avatar-big.png" class="img-responsive img-circle center-block" alt="user">
            <div class="profile-usertitle">
              <div class="profile-usertitle-name">
                John Malalayka
              </div>
              <div class="profile-usertitle-job">
                Admin
              </div>
            </div>
            <div class="profile-userbuttons">
              <button type="button" class="btn btn-primary waves">Follow</button>
              <button type="button" class="btn btn-warning waves">Message</button>
            </div>
            <div class="profile-usermenu">
              <ul class="nav">
                <li class="active">
                  <a href="#">
                    <i class="fa fa-home"></i> Overview </a>
                </li>
                <li>
                  <a href="#">
                    <i class="fa fa-user"></i> Account Settings </a>
                </li>
                <li>
                  <a href="#">
                    <i class="fa fa-check"></i> Tasks </a>
                </li>
                <li>
                  <a href="#">
                    <i class="fa fa-flag"></i> Help </a>
                </li>
              </ul>
            </div>
          </div>
        </div>
        <div class="col-lg-9">
          <div class="tabbable tabs-with-bg">
            <ul class="nav nav-tabs nav-justified">
              <li class="active">
                <a href="#tab-1" data-toggle="tab">Timeline</a>
              </li>
              <li>
                <a href="#tab-2" data-toggle="tab">Settings</a>
              </li>
            </ul>
            <div class="tab-content">
              <div class="tab-pane big-box  fade in active" id="tab-1">
                <ul class="cbp_tmtimeline">
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-10 18:30"><span>4/10/15</span> <span>18:30</span></time>
                    <div class="cbp_tmicon cbp_tmicon-phone"></div>
                    <div class="cbp_tmlabel">
                      <h2>Amet laboriosam saepe</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Amet laboriosam saepe iste, placeat fugit, dolore alias laborum corporis dolorum soluta optio. Voluptates cupiditate quia iure consectetur totam beatae autem perferendis sapiente voluptas placeat suscipit commodi, sunt quasi animi nam laborum rerum est libero error. A ipsum laudantium neque repellendus, dolore ullam harum obcaecati maiores dolorem beatae optio amet non, quo nisi sapiente fugit. Nihil eius laudantium, mollitia. Libero, veniam, officiis.</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-11T12:04"><span>4/11/15</span> <span>12:04</span></time>
                    <div class="cbp_tmicon cbp_tmicon-screen"></div>
                    <div class="cbp_tmlabel">
                      <h2>Tempore dignissimos ipsum repellendus</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore dignissimos ipsum repellendus itaque odit repellat. Sapiente quae, ut voluptates voluptate veniam, sed veritatis, illum commodi reiciendis at suscipit reprehenderit possimus rem maiores totam. Facere vel, sed ex autem perspiciatis, laudantium.</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-13 05:36"><span>4/13/15</span> <span>05:36</span></time>
                    <div class="cbp_tmicon cbp_tmicon-mail"></div>
                    <div class="cbp_tmlabel">
                      <h2>Voluptas quibusdam</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore iste, sapiente architecto cumque eaque quae accusantium perferendis optio inventore, iusto, et similique itaque voluptate recusandae aspernatur dolorem natus eos voluptatibus nam illum eum saepe at? Laboriosam quasi, perferendis ratione, atque harum, tenetur temporibus magnam voluptas enim magni rem illo debitis. Voluptas quibusdam nesciunt ipsam et eum. Repellendus cum neque, hic?</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-15 13:15"><span>4/15/15</span> <span>13:15</span></time>
                    <div class="cbp_tmicon cbp_tmicon-phone"></div>
                    <div class="cbp_tmlabel">
                      <h2>Eligendi odio assumenda</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eligendi odio, assumenda, libero veritatis quo sint quam fugit autem vel eius commodi expedita eveniet nemo quae numquam quibusdam at dolore delectus praesentium, dicta quod hic unde! Corporis deleniti officiis voluptate, voluptatibus doloremque doloribus odit ea! Cupiditate.</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-16 21:30"><span>4/16/15</span> <span>21:30</span></time>
                    <div class="cbp_tmicon cbp_tmicon-earth"></div>
                    <div class="cbp_tmlabel">
                      <h2>Labore veniam quo veritatis</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Labore veniam quo veritatis quas sit necessitatibus blanditiis perferendis cupiditate voluptatem, animi porro cum, accusantium officiis culpa ipsum inventore. Porro quas esse hic cum, sint, similique nemo?</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-17 12:11"><span>4/17/15</span> <span>12:11</span></time>
                    <div class="cbp_tmicon cbp_tmicon-screen"></div>
                    <div class="cbp_tmlabel">
                      <h2>Obcaecati eaque nulla</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Obcaecati eaque nulla, soluta. Labore repellat aperiam praesentium quisquam sapiente officia delectus amet est exercitationem nemo! Sunt, nemo doloremque hic est ipsam sint quod. Officia vero, nostrum libero harum sapiente unde ea, ex dolorum ipsam fuga quae.</p>
                    </div>
                  </li>
                  <li>
                    <time class="cbp_tmtime" datetime="2015-04-18 09:56"><span>4/18/15</span> <span>09:56</span></time>
                    <div class="cbp_tmicon cbp_tmicon-phone"></div>
                    <div class="cbp_tmlabel">
                      <h2>Repellendus laborum</h2>
                      <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio porro incidunt ipsam veniam quis voluptate dolor exercitationem, minus architecto atque aut, maiores animi esse? Eius animi officiis ullam dolores, provident doloremque placeat voluptates ipsam dicta natus odit praesentium similique officia dolorem expedita architecto, dolore veniam facilis hic quia, eligendi aut est. Debitis repudiandae a eligendi hic alias, quaerat consequatur similique architecto soluta animi? Repellendus, laborum.</p>
                    </div>
                  </li>
                </ul>
              </div>
              <div class="tab-pane big-box fade" id="tab-2">
                <form class="content-form">
                  <div class="form-group">
                    <input type="text" class="form-control material" id="username" placeholder="Change username">
                  </div>
                  <div class="form-group">
                    <input type="email" class="form-control material" id="email" placeholder="Choose email">
                  </div>
                  <div class="form-group">
                    <input type="password" class="form-control material" id="password" placeholder="Change password">
                  </div>
                  <div class="form-group">
                    <input type="password" class="form-control material" id="password2" placeholder="Confirm password">
                  </div>
                  <div class="form-group">
                    <button type="submit" class="btn btn-warning text-uppercase waves">Save</button>
                  </div>
                </form>
              </div>
            </div>
          </div>
        </div>
      </div>


      <!--Footer-->
      <div class="footer">© 2015 Copyright</div>
    </div>



    <!--Members Sidebar-->
    <div id="members-sidebar" class="members-sidebar">
      <h4 class="pull-left zero-m">Members</h4>
      <span class="close-members-sidebar"><i class="fa fa-remove pull-right"></i></span>
      <div class="clearfix"></div>
      <ul class="nav">
        <li>
          <div class="messages">
            <div class="member-info">
              <img src="img/team/admin.png" alt="admin" class="img-circle pull-left">
              <span class="member-name">Sash Ficus</span>
              <p class="members-message zero-m">Sushi time)))</p>
            </div>
            <div class="member-info">
              <img src="img/team/admin.png" alt="admin" class="img-circle pull-left">
              <span class="member-name">Sash Ficus</span>
              <p class="members-message zero-m">Working hard</p>
            </div>
          </div>
        </li>
        <li class="members-group">Work</li>
        <li><span class="status online"></span>Sash Ficus</li>
        <li><span class="status online"></span>Sash Ficus</li>
        <li><span class="status not-available"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li class="members-group">Partner</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
        <li><span class="status"></span>Sash Ficus</li>
      </ul>
    </div>

  </div>
  
    <div class="login-modal modal fade">
      <div class="table-wrapper">
        <div class="table-row">
          <div class="table-cell text-center">
           <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <div class="login i-block">
              <div class="content-box">
                <div class="light-blue-bg biggest-box">

                  <h1 class="zero-m text-uppercase">Welcome</h1>

                </div>
                <div class="big-box text-left login-form">
                  <h4 class="text-center">Login</h4>
                  <form>
                    <div class="form-group">
                      <input type="text" class="form-control material" id="login" placeholder="Username">
                    </div>
                    <div class="form-group">
                      <input type="password" class="form-control material" id="password" placeholder="Password">
                    </div>

                    <button type="submit" class="btn btn-block btn-info text-uppercase waves">Login</button>

                  </form>
                  <a href="#" class="green i-block">Forgot password?</a>
                  <p>Do not have an account?</p>
                  <a class="btn btn-block btn-warning text-uppercase waves waves-button">Create an account</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
  </div>
  <div class="logout-modal modal fade">
      <div class="table-wrapper">
        <div class="table-row">
          <div class="table-cell text-center">
            <div class="login i-block">
              <div class="content-box">
                <div class="light-blue-bg biggest-box">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                  <h3 class="zero-m text-uppercase">Do you want to exit?</h3>
                  <a href="#" class="i-block" data-dismiss="modal">Yes</a>
                  <a href="#" class="i-block" data-dismiss="modal">No</a>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
  </div>

    <!--Scripts-->
  <script src="bower_components/jquery/dist/jquery.min.js"></script>
  <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
  <script src="bower_components/metisMenu/dist/metisMenu.min.js"></script>
  <script src="bower_components/Waves/dist/waves.min.js"></script>
  <script src="bower_components/moment/min/moment.min.js"></script>
  <script src="bower_components/jquery.nicescroll/jquery.nicescroll.min.js"></script>
  <script src="bower_components/slimScroll/jquery.slimscroll.min.js"></script>
  <script src="bower_components/malihu-custom-scrollbar-plugin/jquery.mCustomScrollbar.js"></script>
  <script src="bower_components/cta/dist/cta.min.js"></script>
  
  <!--Menu-->
  <script src="js/menu/classie.js"></script>
  <script src="js/menu/gnmenu.js"></script>

  <!--Selects-->
  <script src="js/selects/selectFx.js"></script>


    <!--Custom Scripts-->
  <script src="js/common.js"></script>


</body>

</html>